import React, { Component } from 'react'
//import PubSub from "pubsub-js"
// import { PropTypes } from "prop-types"
import store from '../redux/store'
import { delItem } from "../redux/actions"

export default class commentList extends Component {
    constructor(props) {
        super(props)
        console.log("1111111111111", store.getState().commentList);
        this.state = {
            commentList: store.getState().commentList
        }
        store.subscribe(this.changeStore)
    }
    // static propTypes   = {
    //     commentList: PropTypes.array.isRequired,
    //     delItem:PropTypes.func.isRequired
    // }
    changeStore = () => {
        const obj = store.getState().commentList
        console.log("obj", obj);

        this.setState({
            commentList:obj
        })
    }
    delItem2 = (index) => () => {
        if (window.confirm("确定删除?")) {
            // this.props.delItem(index)
            // PubSub.publish("delItem", index)
            // this.props.delItem(index);
            const action = delItem(index)
            store.dispatch(action)
        } else {
            return
        }
    }
    render() {
        let { commentList } = this.state
        console.log("==========commentList", this.state);

        if (commentList.length === 0) {
            this.isDisplay = "block";
        } else {
            this.isDisplay = "none";
        }

        return (
            <div className="list_wrap">
                <h3 style={{ display: this.isDisplay }}>暂无评论!!!!!</h3>
                {
                    commentList.map((val, index) => {
                        return (
                            <div key={index} className="item_wrap">
                                <div className="item_name">{val.username}说:<button onClick={this.delItem2({ index })}>删除</button></div>
                                <div className="item_context">{val.context}</div>
                            </div>
                        )
                    })
                }
            </div>
        )
    }
}
